@include('admin.public.head')
@include('admin.public.laydate')

<body class="gray-bg">
<div class="ibox-content">

    <div class="col-sm-12 fa-pull-left m-b-xs">
        <form action="">

            <div class="col-sm-1 text-center pull-left">
                <input type="text" id="start_time" name="start_time" value="{{$start_time??''}}" placeholder="开始时间" autocomplete="off" class="input form-control">
            </div>

            <div class="col-sm-1 text-center pull-left">
                <input type="text" id="end_time" name="end_time" value="{{$end_time??''}}" placeholder="结束时间" autocomplete="off" class="input form-control">
            </div>

            <div class="col-sm-1  m-b-xs text-center pull-left">
                <button type="submit" class="btn btn-sm btn-primary">搜索</button> </span>
            </div>
        </form>
    </div>

    <div class="row">
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>充值统计 <small>充值积分</small></h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-content" id="flot-bar-chart"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>约课统计 <small>约课占比</small></h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-content" id="flot-bar-chart-two"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>老师统计 <small>上课占比</small></h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-content" id="flot-pie-chart"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<!-- Flot -->
<script src="{{ URL::asset('./admin/js/plugins/flot/jquery.flot.js') }}"></script>

<script src="{{ URL::asset('./admin/js/plugins/flot/jquery.flot.pie.js') }}"></script>

<script>
    var barOptions = {
        series: {
            bars: {
                show: true,
                barWidth: 0.6,
                fill: true,
                fillColor: {
                    colors: [{
                        opacity: 0.8
                    }, {
                        opacity: 0.8
                    }]
                }
            }
        },
        xaxis: {
            tickDecimals: 0
        },
        colors: ["#1ab394"],
        grid: {
            color: "#999999",
            hoverable: true,
            clickable: true,
            tickColor: "#D4D4D4",
            borderWidth:0
        },
        legend: {
            show: false
        },
        tooltip: true,
        tooltipOpts: {
            content: "x: %x, y: %y"
        }
    };

    var recharge_statistics_json = new Array();

    @foreach($recharge_statistics as $k=>$v)
        var result = new Array();
        var k = "{{$k}}";
        var v = "{{$v}}";
        result.push(parseFloat(k));
        result.push(parseFloat(v));
        recharge_statistics_json.push(result);
    @endforeach


    var recharge_statistics = {
        data: recharge_statistics_json,
        label: "bar"
    };

    $.plot($("#flot-bar-chart"), [recharge_statistics], barOptions);


    var appointment_statistics = {!! $appointment_statistics !!};

    $.plot($("#flot-bar-chart-two"), appointment_statistics, {
        series: {
            pie: {
                show: true
            }
        },
        grid: {
            hoverable: true
        },
        tooltip: true,
        tooltipOpts: {
            content: "%p.0%, %s", // show percentages, rounding to 2 decimal places
            shifts: {
                x: 20,
                y: 0
            },
            defaultTheme: false
        }
    });

    var teacher_statistics = {!! $teacher_statistics !!};

    var plotObj = $.plot($("#flot-pie-chart"), teacher_statistics, {
        series: {
            pie: {
                show: true
            }
        },
        grid: {
            hoverable: true
        },
        tooltip: true,
        tooltipOpts: {
            content: "%p.0%, %s", // show percentages, rounding to 2 decimal places
            shifts: {
                x: 20,
                y: 0
            },
            defaultTheme: false
        }
    });

</script>


</body>

